<template>
    <nav class="nav-box">
        <div class="nav-input">
            <input type="text" @focus="flag=!flag" @blur="setFlag()">
        </div>
        <div class="nav-btn" v-show="flag">
            <span>搜索</span>
        </div>
    </nav>
</template>

<script>
    Vue.component("TopBar", {
        template: document.currentScript.ownerDocument.querySelector("template"),
        data(){
            return {
                flag:false
            };
        },
        methods: {
            setFlag(){
                this.flag=false;
            }
        },
    });
</script>